<template>
  <a-card :bordered="false">
    <a-tabs type="card" @change="classChange">
      <a-tab-pane :key="pc.code" :tab="pc.name" v-for="pc in projectClassList"></a-tab-pane>
    </a-tabs>

    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24" type="flex" align="middle">
          <a-col flex="150px">
            <a-form-item label="">
              <a-date-picker
                mode="year"
                @panelChange="panelChange"
                @openChange="openChange"
                @change="onChange"
                :open="buildYear.open"
                v-model="buildYear.value"
                format="YYYY"
              />
            </a-form-item>
          </a-col>
          <a-col flex="350px">
            <a-form-item label="">
              <a-input-group compact>
                <a-select v-model="queryParam.searchField" @change="changeForceUpdate">
                  <a-select-option value="projectCode"> 项目编号 </a-select-option>
                  <a-select-option value="projectName"> 项目名称 </a-select-option>
                  <a-select-option value="projectManage"> 项目经理 </a-select-option>
                </a-select>
                <a-input-search
                  style="width: 65%"
                  v-model="queryParam.keyword"
                  @search="searchQuery"
                  placeholder="请按照关键字进行搜索"
                />
              </a-input-group>
            </a-form-item>
          </a-col>
          <a-col flex="auto">
            <span class="flex-btn-line">
              <a-button type="primary" @click="showSearchForm = true" icon="search">高级查询</a-button>
              <a-button type="primary" @click="doSearchReset" icon="reload">重置</a-button>
              <a-button type="primary" @click="backApply" icon="undo">退回申请人</a-button>
              <a-button type="primary" @click="refreshRatio" icon="redo">刷新系数</a-button>
              <a-button type="primary" @click="finishProject" icon="check" >项目结题</a-button>
              <a-button type="primary" @click="refreshNodeAuditStatus" icon="redo"
                >刷新节点审批状态</a-button
              >
              <a-button
                type="primary"
                @click="handlePostExportXls('项目清单报表')"
                icon="vertical-align-bottom"
                >导出</a-button
              >
              <a-button type="primary" @click="gather" icon="snippets">汇总数据</a-button>
              <a-button type="primary" @click="markImport">标记重点</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>

      <a-modal
        :visible="showSearchForm"
        width="70vw"
        :bodyStyle="{ padding: '10px' }"
        title="高级查询"
        @ok="handleToSearch"
        @cancel="showSearchForm = false"
      >
        <a-form-model ref="ruleForm" :label-col="labelCol" :wrapper-col="wrapperCol">
          <a-row :gutter="24">
            <a-col :span="8">
              <a-form-model-item label="项目名称">
                <a-input v-model="queryParam.projectName" />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="项目编号">
                <a-input v-model="queryParam.projectCode" />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="项目经理">
                <a-input v-model="queryParam.projectManage" />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row :gutter="24">
            <a-col :span="8">
              <a-form-model-item label="重点项目">
                <a-radio-group v-model="queryParam.importFlag">
                  <a-radio :value="1"> 是 </a-radio>
                  <a-radio :value="0"> 否 </a-radio>
                </a-radio-group>
              </a-form-model-item>
            </a-col>
            <a-col :span="8" v-show="queryParam.searchClass == '40' || queryParam.searchClass == '41'">
              <a-form-model-item label="数字贷">
                <a-radio-group v-model="queryParam.digitalLoan">
                  <a-radio :value="1"> 是 </a-radio>
                  <a-radio :value="0"> 否 </a-radio>
                </a-radio-group>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="项目子类">
                <CodeSelector
                    type="select"
                    :codes="projectSubClassList"
                    codeKey="code"
                    nameKey="name"
                    :code.sync="queryParam.subClass"
                    multiple="default"
                  ></CodeSelector>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-modal>

      <a-modal
        :visible="markVisible"
        width="600px"
        :bodyStyle="{ padding: '10px' }"
        title="标记重点项目"
        @ok="handleToMark"
        @cancel="markVisible = false"
      >
        <a-form-model ref="ruleFormMark" :label-col="labelCol" :wrapper-col="wrapperCol">
          <span style="color: red; margin-left: 40px">标记为重点项目后将在项目馆列表的项目名称旁显示【重点】</span>
          <a-row :gutter="24">
            <a-col :span="24">
              <a-form-model-item label="标记重点">
                <a-radio-group v-model="markFlag">
                  <a-radio value="true">标记重点</a-radio>
                  <a-radio value="false">取消标记重点</a-radio>
                </a-radio-group>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-modal>

      <a-modal
        title="项目汇总"
        :visible="projectCountVisible"
        centered
        @ok="projectCountVisible = false"
        @cancel="projectCountVisible = false"
        width="600px"
      >
        <div style="width: 100%; height: 300px">
          <div style="padding: 20px 100px 0 100px; text-align: center" v-for="(pc, index) in projectCount" :key="index">
            {{ pc.projectType }}类项目: {{ pc.projectAmount }} 个 ,总绩点: {{ pc.projectScoreAmount }} ,总奖励:
            {{ pc.projectAwardAmount }}
          </div>
        </div>
      </a-modal>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <div class="table-operator"></div>
    <div class="container">
      <a-table
        ref="table"
        bordered
        size="middle"
        :rowKey="rowKey"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :scroll="{ x: true }"
        :rowSelection="{
          selectedRowKeys: selectedRowKeys,
          onChange: onSelectChange,
          onSelectAll: onSelectAll,
          columnWidth: 1,
        }"
        @change="handleTableChange"
      >
      </a-table>
    </div>

    <!-- table区域-begin -->
  </a-card>
</template>

<script>
import { getAction, postAction } from '@/api/manage'
import { codeInfoList } from '@/api/codeInfo'
import { JeecgListMixin } from '@/mixins/JeecgListSearchMixin'
import moment from 'moment'

var cols = [
  {
    title: '状态',
    align: 'center',
    width: 60,
    dataIndex: 'projectStatus',
  },
  {
    title: '项目编码',
    align: 'center',
    width: 100,
    dataIndex: 'projectCode',
  },
  {
    title: '原WBS号',
    align: 'center',
    width: 100,
    dataIndex: 'wbsNo',
  },
  {
    title: '项目名称',
    align: 'center',
    width: 120,
    dataIndex: 'projectName',
  },
  {
    title: '主导经营体',
    align: 'center',
    width: 120,
    dataIndex: 'mainDeptName',
  },
  {
    title: '计划立项时间',
    align: 'center',
    width: 100,
    dataIndex: 'createDate',
  },
  {
    title: '立项完成时间',
    align: 'center',
    width: 100,
    dataIndex: 'realCompletionDate',
  },
  {
    title: '申请绩点',
    align: 'center',
    width: 60,
    dataIndex: 'projectScore',
  },
  {
    title: '申请级别',
    align: 'center',
    width: 60,
    dataIndex: 'projectLevel',
  },
  {
    title: '审批绩点',
    align: 'center',
    width: 60,
    dataIndex: 'auditPoint',
  },
  {
    title: '审批级别',
    align: 'center',
    width: 60,
    dataIndex: 'auditLevel',
  },
  {
    title: '预算',
    align: 'center',
    width: 80,
    dataIndex: 'auditAmounts',
  },
  {
    title: '重点项目',
    align: 'center',
    width: 80,
    dataIndex: 'importFlagStr',
  },
  {
    title: '项目经理',
    align: 'center',
    width: 120,
    dataIndex: 'projectManage',
  },
  {
    title: 'Y绩点',
    align: 'center',
    width: 80,
    dataIndex: 'projectGradePointBasic',
  },
  {
    title: '核心力值',
    align: 'center',
    width: 80,
    dataIndex: 'projectGradePointCore',
  },
]
export default {
  name: 'ProjectListReport',
  mixins: [JeecgListMixin],
  data() {
    return {
      /* 勾选导出参数 */
      rowKey: 'id',
      busType: 'ProjectListReport',
      description: '项目清单报告',
      projectClassList: [],
      projectSubClassList:[],
      buildYear: {
        open: false,
        value: null,
      },
      columns: [],
      url: {
        list: '/projectListReport/list',
        exportXlsUrl: '/projectListReport/export',
        codeInfoList: '/manage/codeInfo/list',
        backApply: '/projectListReport/backApply',
        refreshRatio: '/projectListReport/refreshRatio',
        finishProject: '/projectListReport/finishProject',
        markProjectImport: '/projectListReport/markProjectImport',
        refreshTimeNodeAudit: '/projectListReport/refreshTimeNodeAudit',
        gather: '/projectListReport/gather',
      },
      projectCountVisible: false,
      projectCount: [],
      showSearchForm: false,
      keyword: '',
      labelCol: { span: 8 },
      wrapperCol: { span: 15 },
      markVisible: false,
      markFlag: '',
    }
  },
  mounted() {
    this.queryParam.searchField = 'projectCode'
    this.doInit()
    this.freshColumns()
  },
  computed: {},
  methods: {
    moment,
    handleToSearch() {
      this.showSearchForm = false
      this.searchQuery()
    },
    backApply() {
      console.log('this.selectedRowKeys:', this.selectedRowKeys)
      if (this.selectedRowKeys.length != 1) {
        this.$message.warning('请选择1个要退回的项目')
        return
      }
      var this_ = this
      this.$confirm({
        title: '确定回退该项目立项到申请人?',
        onOk() {
          postAction(this_.url.backApply, { id: this_.selectedRowKeys[0], adminBackFlag: true })
            .then((res) => {
              if (res.code == 200) {
                this_.$message.success('操作成功')
                setTimeout(function () {
                  this_.loadData(1)
                }, 1500)
              } else {
                this_.$message.warning('操作失败:' + res.message)
              }
            })
            .catch((res) => {
              this_.$message.warning('操作异常:' + res.message)
            })
        },
        onCancel() {},
      })
    },
    refreshRatio() {
      if (this.selectedRowKeys.length < 1) {
        this.$message.warning('请选择要刷新系数的项目')
        return
      }
      var this_ = this
      this.$confirm({
        title: '确定对选中的项目按配置重新计算预计奖励?',
        onOk() {
          getAction(this_.url.refreshRatio, { ids: this_.selectedRowKeys.join(',') })
            .then((res) => {
              if (res.code == 200) {
                this_.$message.success('操作成功')
                setTimeout(function () {
                  this_.loadData(1)
                }, 1500)
              } else {
                this_.$message.warning('操作失败:' + res.message)
              }
            })
            .catch((res) => {
              this_.$message.warning('操作异常:' + res.message)
            })
        },
        onCancel() {},
      })
    },
    finishProject() {
      if (this.selectedRowKeys.length < 1) {
        this.$message.warning('请选择要结题的项目')
        return
      }
      for (var i = 0; i < this.selectionRows.length; i++) {
        if (this.selectionRows[i].status < 4) {
          this.$message.warning('已完成的项目才可以结题')
          return
        }
      }
      var this_ = this
      this.$confirm({
        title: '选择的项目是否都已经完成所有节点报工，可以进行结题?',
        onOk() {
          getAction(this_.url.finishProject, { ids: this_.selectedRowKeys.join(',') })
            .then((res) => {
              if (res.code == 200) {
                this_.$message.success('操作成功')
                setTimeout(function () {
                  this_.loadData(1)
                }, 1500)
              } else {
                this_.$message.warning('操作失败:' + res.message)
              }
            })
            .catch((res) => {
              this_.$message.warning('操作异常:' + res.message)
            })
        },
        onCancel() {},
      })
    },
    markImport() {
      if (this.selectedRowKeys.length < 1) {
        this.$message.warning('请选择要标记的项目')
        return
      }
      this.markVisible = true
      this.markFlag = ''
    },
    handleToMark() {
      if (this.markFlag == '') {
        this.$message.warning('请选择标记项')
        return
      }
      var that = this
      getAction(this.url.markProjectImport, { ids: this.selectedRowKeys.join(','), markFlag: this.markFlag })
        .then((res) => {
          if (res.code == 200) {
            this.$message.success('操作成功')
            this.markVisible = false
            setTimeout(function () {
              that.loadData(1)
            }, 1500)
          } else {
            this.$message.warning('操作失败:' + res.message)
          }
        })
        .catch((res) => {
          this.$message.warning('操作异常:' + res.message)
        })
    },
    refreshNodeAuditStatus() {
      var this_ = this
      this.$confirm({
        title: '此操作将把审批状态不正常的项目节点更正?',
        onOk() {
          getAction(this_.url.refreshTimeNodeAudit)
            .then((res) => {
              if (res.code == 200) {
                this_.$message.success('操作成功')
              } else {
                this_.$message.warning('操作失败:' + res.message)
              }
            })
            .catch((res) => {
              this_.$message.warning('操作异常:' + res.message)
            })
        },
        onCancel() {},
      })
    },
    gather() {
      this.projectCountVisible = true
      getAction(this.url.gather, {
        keyword: this.queryParam.keyword,
        searchYear: this.queryParam.searchYear,
        searchClass: this.queryParam.searchClass,
      })
        .then((res) => {
          if (res.code == 200) {
            this.projectCount = res.result
          } else {
            this.$message.warning('操作失败:' + res.message)
          }
        })
        .catch((res) => {
          this.$message.warning('操作异常:' + res.message)
        })
    },
    freshColumns() {
      this.columns = JSON.parse(JSON.stringify(cols))
      if (this.queryParam.searchClass == '40') {
        this.columns.splice(7, 0, { title: '计划投产时间', align: 'center', width: 100, dataIndex: 'completionDate' })
        this.columns.push({ title: '数字贷', align: 'center', width: 80, dataIndex: 'digitalLoanStr' })
      } else if (this.queryParam.searchClass == '41') {
        this.columns.splice(7, 0, { title: '计划完成时间', align: 'center', width: 100, dataIndex: 'completionDate' })
        this.columns.push({ title: '数字贷', align: 'center', width: 80, dataIndex: 'digitalLoanStr' })
      } else {
        this.columns.splice(12, 0, { title: '高企', align: 'center', width: 60, dataIndex: 'isHeightTechProject' })
      }
    },
    classChange(key) {
      this.selectedRowKeys = []
      this.selectionRows = []
      this.queryParam.searchClass = key
      this.freshColumns()
      this.loadData()
    },
    openChange(status) {
      if (status) {
        this.buildYear.open = true
      } else {
        this.buildYear.open = false
      }
    },
    panelChange(value, mode) {
      console.log('panelChange:', value)
      this.queryParam.searchYear = value.year()
      this.buildYear.value = this.moment(value.year(), 'YYYY')
      this.buildYear.open = false
      this.searchQuery()
    },
    onChange(dates, dateStrings) {
      if (dates == null) {
        this.queryParam.searchYear = null
        this.searchQuery()
      }
    },
    doInit() {
      codeInfoList({
        column: 'code',
        order: 'Asc',
        pageNo: 0,
        pageSize: -1,
        isdel: false,
        type: '项目分类',
        parentid: this.activeCode,
      }).then((res) => {
        this.projectClassList = res.result.records
        this.queryParam.searchClass = this.projectClassList[0].code
        this.searchQuery()
      })
      codeInfoList({
        column: 'code',
        order: 'Asc',
        pageNo: 0,
        pageSize: -1,
        isdel: false,
        type: '项目子类',
        parentid: this.queryParam.searchClass,
      }).then((res) => {
        this.projectSubClassList = [{code:"",name:"全部"},...res.result.records]
      })
    },
    doSearchReset() {
      var pcls = this.queryParam.searchClass
      this.buildYear.value = null
      this.searchReset()
      this.queryParam.searchClass = pcls
      this.queryParam.searchField = 'projectCode'
    },
  },
}
</script>
<style lang="less" scoped>
@import '~@assets/less/common.less';
@import '~@assets/less/hte-main.less';
@media (max-width: 1170px) {
  .page-main .container section .list-content > div.flex-num1-box {
    flex-wrap: wrap;
    > div {
      &:nth-child(1),
      &:nth-child(2) {
        width: 48%;
      }
      &:nth-child(3) {
        width: 100%;
        justify-content: flex-start;
        > span {
          margin-right: 20px;
          margin-left: 0;
        }
      }
    }
  }
  .page-main .container section .list-content > div.flex-num2-box {
    display: block;
    margin-top: 0;
  }
}
/deep/ .ant-modal-content {
  border-radius: 15px;
}
/deep/ .ant-modal-title,
/deep/ .ant-modal-footer {
  text-align: center;
}
/deep/ .ant-transfer-operation .ant-btn-primary {
  background-color: #f5f5f5 !important;
}
/deep/ .ant-modal-header {
  border-radius: 15px 15px 0 0;
  background-image: linear-gradient(90deg, #15b1ff 0%, #1158c9 100%);
}
/deep/ .ant-modal-title {
  color: #fff;
}
</style>
